<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>响应式图片</title>
    <style>
        /* 响应式图片会自动适配各种尺寸的屏幕。 */

        /* 如果你需要自由缩放图片，且图片放大的尺寸不大于其原始的最大值，则可使用以下代码 */
        img {
            max-width: 100%;
            height: auto;
        }
    </style>
</head>

<body>

    <h2>响应式图片</h2>
    <p>响应式图片会自动适配各种尺寸的屏幕。</p>
    <p>通过重置浏览器大小查看效果:</p>

    <img src="images/trolltunga.jpg" alt="Norway" width="1000" height="300">

</body>

</html>